body {
	margin: 0px;
	border: 0px;
	padding: 0px;
	background: #4d4d4d;
	direction: ltr;
	overflow-x: hidden;
	overflow-y: hidden;
	font-family:"lucida grande",tahoma,verdana,arial,sans-serif;
	font-size:13px;
	color: #fafad2;
}

h1 {
	color: orange;
	text-align: center;
}

h2 {
	color: orange;
	text-align: center;
}

button {
	-moz-box-shadow: inset 0px 1px 0px 0px #fff6af;
	-webkit-box-shadow: inset 0px 1px 0px 0px #fff6af;
	box-shadow: inset 0px 1px 0px 0px #fff6af;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffec64
		), color-stop(1, #ffab23) );
	background: -moz-linear-gradient(center top, #ffec64 5%, #ffab23 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffec64',
		endColorstr='#ffab23' );
	background-color: #ffec64;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	border: 1px solid #ffaa22;
	display: inline-block;
	color: #333333;
	font-family:"lucida grande",tahoma,verdana,arial,sans-serif;
	font-size: 15px;
	font-weight: bold;
	padding: 6px 24px;
	text-decoration: none;
	text-shadow: 1px 1px 0px #ffee66;
}
button:hover {
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffab23
		), color-stop(1, #ffec64) );
	background: -moz-linear-gradient(center top, #ffab23 5%, #ffec64 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffab23',
		endColorstr='#ffec64' );
	background-color: #ffab23;
}

button:active {
	position: relative;
	top: 1px;
}

.header {
	position: absolute;
	top: 0;
	width: 100%;
	height: 25%;
	background-color: gray;
}
.logo{
	/*resize image (keeping ratio)*/
	height: 100px;
	width: auto;
}

.main{
	position: absolute;
	top: 25%;
	width: 100%;
}

/* runsTable header row */
.runsTableHeader {
	background-color: #808080;
	color: black;
	font-style: italic;
	text-align: center;
	
}

/* runsTable */
.runsTable {
	position: absolute;
	border: 1px solid #e3e3e3;
	background-color: #f2f2f2;
	width: 30%;
	overflow: auto;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	color: black;

}

.runsTableRow:HOVER {
	background: navy;
	cursor: pointer;
}
.friendsTable{
	position: absolute;
	border: 1px solid #e3e3e3;
	background-color: #f2f2f2;
	width: auto;
	overflow: auto;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	color: black;

}
.friendsTable td{
	vertical-align:middle;
}

.mapStyle {
	position: absolute;
	top: 30%;
	width: 40%;
	height: 50%;
	border: 10px solid #808080;
	border-radius: 20px;
	webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	
}

.mapFriendActivity {
	width: 40%;
	height: 50%;
	border: 10px solid #808080;
	border-radius: 20px;
	webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	
	position: absolute;
	top: 40%;
	left: 5%;
}

.map2FriendActivity {
	width: 40%;
	height: 50%;
	border: 10px solid #808080;
	border-radius: 20px;
	webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	
	position: absolute;
	top: 40%;
	left: 50%;
}

.friendImage:HOVER {
	cursor: pointer;
}

.topPanel {
	/* Centers horizontially*/
	margin-left: auto;
	margin-right: auto;
	position: relative;
	
	
}

.userInfoPanel {
	padding: 5px;
	position: absolute;
	top: 20%;
	left: 2%;
	
	border-style: solid;
	border-color: #fafad2;
	color: #333333;
	
	background: -moz-linear-gradient(top, #F0F0F0 0, #DBDBDB 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #F0F0F0), color-stop(100%, #DBDBDB));
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F0F0F0', endColorstr='#DBDBDB', GradientType=0);
	border: 1px solid #B0B0B0;
	
	border-radius: 20px;

}

.foot {
	background: white;
	color: #333333;
	position: absolute;
	top:95%;
	height: 5%;
	width: 100%;
	font-size: 10px;
}
.spamlogo{
	/*resize*/
	position: relative;
	top: -5px;
	height: 30px;
	width: auto;
	
}

.senderTable{
	position: absolute;
	left: 5%;
	top: 20%;
}

.receiverTable{
	position: absolute;
	left: 50%;
	top: 20%;
}

.activityTable{
	border: 1px solid #e3e3e3;
	background-color: #f2f2f2;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	color: black;
}
.activityTable td{
	padding-left: 1px;
	padding-right: 1px;
}
.activityTableHeader{
	background-color: #808080;
	color: black;
	font-style: italic;
}
.activityDisplayPanel{
	position: absolute;
	top: 20%;
	left:5%;
	width: 100%;
}
.scrollPanel{
	height: 50%;
	width: 30%;
}


.competitionTable{
	position: absolute;
	border: 1px solid #e3e3e3;
	background-color: #f2f2f2;
	overflow: auto;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	color: black;

}
.competition-dispaly{
	position: absolute;
	width: auto;
	margin-left: auto;
	margin-right: auto;
}
.competitionWidget{
	text-align: center;
}
.competitionDisplayPanel{
	width: 100%;
}